﻿/**

 @Name：drag 移动模块
 @Author：Zxq
 @License：MIT
    
 */
layui.define(function (exports) {
    "use strict";
    
    var getCoords = function(el){
        var box = el.getBoundingClientRect(),
        doc = el.ownerDocument,
        body = doc.body,
        html = doc.documentElement,
        clientTop = html.clientTop || body.clientTop || 0,
        clientLeft = html.clientLeft || body.clientLeft || 0,
        top  = box.top  + (self.pageYOffset || html.scrollTop  ||  body.scrollTop ) - clientTop,
        left = box.left + (self.pageXOffset || html.scrollLeft ||  body.scrollLeft) - clientLeft;
        return { 'top': top, 'left': left };
    };

    //构造函数
    var Drag = function(){
        this.List = [];
        this.current = null;
    };

    var DragElem = function (el, options, inst) {
        var that = this;
        var moveAble = true;
        //el.style.position = "absolute";
        var options  = options || {},
            container = options.container || document.documentElement,
            selfonly = false || options.selfonly,
            mirror = false || options.mirror,
            lockX = false || options.lockX,
            lockY = false || options.lockY;
        this.elem = el;
        this.mirrorElem = null;//移动时启用的镜像，移动结束后销毁
        this.container = options.container;
        this.setMoveAble = function (moveable) {
            if (moveable) {
                moveAble = true;
                if (options.cursor !== false)
                    el.style.cursor = "move";
            }
            else {
                moveAble = false;
                if (options.cursor !== false)
                    el.style.cursor = "";
            }
        };
        this.setMoveAble(true);
        var position;//记录每次移动位置，可判断移动方向
        var drag = function(e) {
            e = e || window.event;
            !+"\v1"? document.selection.empty() : window.getSelection().removeAllRanges();
            var _left = e.clientX - el.offset.x,
                _top = e.clientY - el.offset.y;
            if (!position) {
                position = { left:_left,top:_top };
                return;
            }
            else if (_left==position.left && _top==position.top) 
                return;
            if(options.container){
                var _right = _left + el.offsetWidth,
                _bottom = _top + el.offsetHeight,
                offset = getCoords(container),
                _cLeft = offset.left,
                _cTop = offset.top,
                _cRight = _cLeft + container.clientWidth,
                _cBottom = _cTop + container.clientHeight;
                _left = Math.max(_left, _cLeft);
                _top = Math.max(_top, _cTop);
                if(_right > _cRight){
                    _left = _cRight - el.offsetWidth;
                }
                if(_bottom > _cBottom){
                    _top = _cBottom - el.offsetHeight;
                }
            }
            if(lockX){
                _left = el.lockX;
            }
            if(lockY){
                _top = el.lockY;
            }
            inst.current = that;
            position = { left:_left,top:_top,X:e.clientX,Y:e.clientY };
            if (mirror) {
                if (that.mirrorElem == null) {
                    that.mirrorElem = document.createElement("div");
                    that.mirrorElem.innerHTML = el.outerHTML;
                    that.mirrorElem.setAttribute("style", "opacity:0.8");
                    document.body.appendChild(that.mirrorElem);
                }
                that.mirrorElem.firstChild.style.left = _left  + "px";
                that.mirrorElem.firstChild.style.top = _top  + "px";
            }
            else {
                el.style.left = _left  + "px";
                el.style.top = _top  + "px";
            }
            if (typeof options.Moving === "function")
                options.Moving.call(this, el);
        }
        var dragend = function(){
            document.onmouseup = null;
            document.onmousemove = null;
            if (that.mirrorElem) {
                var doMove = true;
                document.body.removeChild(that.mirrorElem);
                that.mirrorElem = null;
                if (typeof options.mirrorEnd === "function")
                    doMove = options.mirrorEnd.call(this, el, position);
                if (doMove) {
                    el.style.left = position.left;
                    el.style.top = position.top;
                }
            }
            if (typeof options.afterMove === "function")
                options.afterMove.call(this, el);
            inst.current = null;
        }
        var dragstart = function(e){
            if (!moveAble) return false;
            e = e || window.event;
            var target = e.target || e.srcElement;
            if (selfonly && target !== el) return false;
            if (typeof options.beforeMove === "function" && !options.beforeMove.call(this, el))
                return false;
            var offset = getCoords(el);
            if(lockX){
                el.lockX = offset.left;
            }
            if(lockY){
                el.lockY = offset.top;
            }
            /*if(/a/[-1]=='a'){
                el.offset_x = e.layerX;
                el.offset_y = e.layerY;
            }else{
                el.offset_x = e.offsetX;
                el.offset_y = e.offsetY;
            }*/
            offset.x = e.pageX - offset.left;
            offset.y = e.pageY - offset.top;
            el.offset = offset;//el初始位置及触发点相距元素的位置
            document.onmousemove = drag;
            document.onmouseup = dragend;
            return false;
        }
        el.onmousedown = dragstart;
    };

    Drag.prototype = {
        init: function (el, options) {
            var elem = new DragElem(el, options, this);
            this.List.push(elem);
            return elem;
        }
    };

    window.drag = new Drag();

    exports('drag', {});

    delete layui.drag;
});